<template>
  <el-dialog :visible="visible"
             title='加工'
             @close="visible = false">
    <el-form class="form">
      <el-form-item label="种植批次">
        <el-input v-model="formData.plantId" disabled/>
      </el-form-item>
      <el-form-item label="加工地点">
        <el-input v-model="formData.processSite" />
      </el-form-item>
      <el-form-item label="加工方式">
        <el-select v-model="formData.processMode">
          <el-option v-for="item in processModeOption"
                     :key="item.value"
                     :label="item.label"
                     :value="item.value"> </el-option>
        </el-select>
      </el-form-item>
      <!-- 商品产品 -->
      <el-form-item label="加工产品">
        <el-select v-model="formData.processType">
          <el-option v-for="item in productList"
                     :key="item.productId"
                     :label="item.productName"
                     :value="item.productName"> </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="加工时间">
        <el-date-picker v-model="formData.gmtCreate"
                        type="datetime"
                        placeholder="加工时间"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        format="yyyy-MM-dd HH:mm:ss" />
      </el-form-item>
        <el-form-item label="加工人员">
        <el-select v-model="formData.processStaff"
                   class="sel2"
                   placeholder="请选择"
                   style="width: 186px;">
          <el-option v-for="item in employeeList"
                     :key="item.employee_id"
                     :label="item.employee_name"
                     :value="item.employee_name" />
        </el-select>
      </el-form-item>
      <el-form-item label="联系电话">
        <el-input v-model="formData.staffPhone" />
      </el-form-item>
    </el-form>
    <el-button @click="visible = false">取 消</el-button>
    <el-button type="primary"
               @click="confirm">确 定</el-button>
  </el-dialog>
</template>

<script>
import { saveProcessing } from '@/api/plant/processing'
import {processModeList} from "@/config/dict/trace"
import { getAllEmployee } from "@/api/plant/employee"
import {getAllProduct} from "@/api/mall/product"
export default {
  data () {
    return {
      visible: false,
      formData: {
        id: '',
        plantId: '',
        processMode: '',
        processType: '',
        processSite: '',
        processStaff: '',
        staffPhone: '',
      },
      employeeList: [],
      productList:[],
      processModeOption:processModeList
    }
  },
  methods: {
    async init (data) {
      this.visible = true
      this.formData = {
        id: '',
        plantId: '',
        processMode: '',
        processType: '',
        processSite: '',
        processStaff: '',
        staffPhone: '',
      }
      if(data){
        this.formData.plantId  = data.plantId;
        this.formData.processType = data.productName
      }
      getAllEmployee().then(res => {
        this.employeeList = res.data
      })
      getAllProduct().then(res => {
        this.productList = res.data.records
      })
    },
    confirm () {
      saveProcessing(this.formData).then(response => {
        if (response.statusCode == 20000) {
          this.refresh()
          this.visible = false
          this.$message({
            message: '操作成功',
            type: 'success'
          })
        } else {
          this.$message({
            message: '发生错误，操作失败',
            type: 'warning'
          })
        }
      })
    },
    refresh () {
      this.$emit('refresh')
    }
  }
}
</script>

<style>
.form {
  margin-bottom: 20px;
}
</style>
